<!--
 * @Description: 
 * @Autor: 商晓彬
 * @Date: 2021-09-02 11:20:05
 * @LastEditors: 商晓彬
 * @LastEditTime: 2021-12-21 08:58:21
-->

<div bsModal #createOrEditModal="bs-modal" (onShown)="onShown()" class="add modal fade" tabindex="-1" role="dialog"
    aria-labelledby="createOrEditModal" aria-hidden="true" [config]="{backdrop: 'static', keyboard: !saving}">
    <div style="width:1244px!important;margin: 1.75rem auto;">
        <div class="modal-content">
            <form *ngIf="active" #bopForm="ngForm" novalidate autocomplete="off">
                <div class="modal-header">
                    <h4 class="modal-title">
                        <span>{{addexTitle}}</span>
                    </h4>
                    <button type="button" class="close" (click)="close()" [attr.aria-label]="l('Close')"
                        [disabled]="saving">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body" style="height: 733px!important;overflow: auto; width: 100%;">
                    <div class="p-formgroup-inlined flex " *ngIf="checktype !=1 && checktype !=2&& checktype !=3&& checktype !=4">
                        <div class="flex">
                            <label style="margin-top: 5px;">放行单号：</label>
                            <p-dropdown filter="true" name="releaseOrder" [options]="releaseOrderOptions"
                                placeholder="请选择放行单号" [(ngModel)]="queryInfo.releaseOrder" emptyFilterMessage="暂无数据">
                                <ng-template let-item pTemplate="selectedItem">
                                    <span
                                        style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                </ng-template>
                                <ng-template let-model pTemplate="item">
                                    <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                        <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">
                                            {{model.label}}
                                        </div>
                                    </div>
                                </ng-template>
                            </p-dropdown>
                        </div>
                        <div class="flex">
                            <label style="margin-top: 5px;margin-left: 10px;">合格证号：</label>
                            <p-dropdown filter="true" name="qualifiedNumber" [options]="qualifiedNumberOptions"
                                placeholder="请选择合格证号" [(ngModel)]="queryInfo.qualifiedNumber" emptyFilterMessage="暂无数据">
                                <ng-template let-item pTemplate="selectedItem">
                                    <span
                                        style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                </ng-template>
                                <ng-template let-model pTemplate="item">
                                    <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                        <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">
                                            {{model.label}}
                                        </div>
                                    </div>
                                </ng-template>
                            </p-dropdown>
                        </div>
                        <button pButton type="button" label="查询" (click)="getCertificateByNumEv()"
                            style="margin-left: 1.5rem"></button>
                        <button pButton type="button" label="重置" (click)="resert()"
                            style="margin-left: 1.5rem"></button>
                    </div>
                    <div *ngIf="checktype ==1 ||checktype ==2|| checktype ==3 || checktype ==4">
                        <span>
                            <label style="margin-top: 5px;">放行单号：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="releaseOrder"
                                type="text" [(ngModel)]="queryInfo.releaseOrder" />
                        </span>
                        <span>
                            <label style="margin-top: 5px;">合格证号：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="qualifiedNumber"
                                type="text" [(ngModel)]="queryInfo.qualifiedNumber" />
                        </span>
                    </div>
                    <hr style="border: 0.5px solid #DDDDDD;">
                    <div *ngIf="form" class="p-formgroup-inline flex">
                        <div class="flex">
                            <label style="margin-top: 5px;">产品图号：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;"
                                name="productDrawingNos" type="text" [(ngModel)]="form.productDrawingNo" />
                        </div>
                        <div class="flex">
                            <label style="margin-top: 5px;">产品名称：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="productNames"
                                type="text" [(ngModel)]="form.productName" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">批次：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="batchs"
                                type="text" [(ngModel)]="form.batch" />
                        </div>
                        <div class="flex">
                            <label style="margin-top: 5px;">合格证任务号：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;"
                                name="qualifiedTaskNumber" type="number" [(ngModel)]="form.qualifiedTaskNumber" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">阶段标记：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="stageMark"
                                type="text" [(ngModel)]="form.stageMark" />
                        </div>
                    </div>
                    <div class="p-formgroup-inline flex mt">
                        <div class="flex">
                            <label class="lwid">*型号(产品代号):</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="productCode"
                                type="text" [(ngModel)]="form.productCode" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">*发次：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="sendTime"
                                type="text" [(ngModel)]="form.sendTime" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">*物料类别:</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="materialsNode"
                                type="text" [(ngModel)]="form.materialsNodeDesc" />
                        </div>
                        <div class="flex">
                            <label style="margin-top: 5px;width: 91px;">*物料细类:</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;"
                                name="materialCategory" type="text" [(ngModel)]="form.materialCategoryDesc" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">规格：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="Module"
                                type="text" [(ngModel)]="form.module" />
                        </div>
                    </div>
                    <div class="p-formgroup-inline flex mt">
                        <div class="flex time">
                            <label class="lwid" style="margin-top: 5px;">有效期止:</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="expirationDates"
                                type="text" [(ngModel)]="form.expirationDate" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">*单位：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="units"
                                type="text" [(ngModel)]="form.unit" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">储位：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="binLocations"
                                type="text" [(ngModel)]="form.binLocation" />
                        </div>
                    </div>
                    <div class="p-formgroup-inline flex mt">
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;">数量：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="quantity"
                                type="text" [(ngModel)]="form.quantity" />
                        </div>
                        <div class="flex">
                            <label class="lwid">产品编号(件号):</label>
                            <input disabled style=" width:375px;height: 70px;margin-right: 10px;" name="productNumber"
                                type="text" [(ngModel)]="form.productNumber" />
                        </div>
                        <div class="flex">
                            <label style="margin-top: 5px;width: 91px;">特殊记载：</label>
                            <textarea rows="5" cols="30" disabled style=" width:375px;height: 70px;margin-right: 10px;" name="specialRecords"
                                type="text" [(ngModel)]="form.specialRecords" ></textarea>
                        </div>
                    </div>
                    <hr style="border: 0.5px solid #DDDDDD;">
                    <div class="p-formgroup-inline ">
                        <h4>出库信息：</h4>
                    </div>
                    <div style="margin-bottom: 10px;">
                        <label class="lwid">产品编号(件号):</label>
                        <div class="row align-items-center">
                            <div class="primeng-datatable-container">
                                <p-table [value]="form.certificateContents" [lazy]="true" [scrollable]="true"
                                    [(selection)]="selectRow">
                                    <ng-template pTemplate="header" selectionMode="multiple">
                                        <tr>
                                            <th style="width: 50px" *ngIf="checktype !=4">
                                                <p-tableHeaderCheckbox></p-tableHeaderCheckbox>
                                            </th>
                                            <th style="width: 50px">序号</th>
                                            <th style="width: 100px">产品编号</th>
                                            <th style="width: 100px">库存状态</th>
                                        </tr>
                                    </ng-template>
                                    <ng-template pTemplate="body" let-record="$implicit" let-rowIndex="rowIndex">
                                        <tr>
                                            <td style="width: 50px" *ngIf="checktype !=4">
                                                <p-tableCheckbox [disabled]="checktype ==1 || checktype ==4" [value]="record">
                                                </p-tableCheckbox>
                                            </td>
                                            <td style="width: 50px">{{rowIndex+1}}</td>
                                            <td style="width: 100px">{{record.productNumber}}</td>
                                            <td style="width: 100px">{{record.outboundStateDesc}}</td>
                                        </tr>
                                    </ng-template>
                                </p-table>
                            </div>
                        </div>
                    </div>
                    <div class="p-formgroup-inline flex">

                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;margin-left: 10px;">数量：</label>
                            <input disabled style=" width:150px;height: 35px;margin-right: 10px;" name="numbers"
                                type="text" [(ngModel)]="selectRow.length" />
                        </div>
                        <div class="flex">
                            <label class="lwid" style="margin-top: 5px;margin-left: 26;">去向：</label>
                            <input style=" width:150px;height: 35px;margin-right: 10px;"
                                [disabled]="checktype ==1 ||checktype ==3||checktype ==4" name="whereAbouts" type="text"
                                [(ngModel)]="inputForm.whereAbouts" placeholder="装配任务号" />
                        </div>
                        <span class="flex" *ngIf="addexTitle == '退库作业' || addexTitle == '退库查看'">
                            <label class="lwid" style="margin-top: 5px;width: 91px;margin-left: 25px;">*退库人：</label>
                            <p-dropdown filter="true" #operationPersonSelect="ngModel" name="operationPerson"
                                [options]="inventoryPeopleList" placeholder="请选择退库人" [disabled]='checktype ==1||checktype ==4'
                                dataKey="value" filterBy="label" [optionLabel]="'label'" [(ngModel)]="operationPerson"
                                emptyFilterMessage="暂无数据" required>

                            </p-dropdown>
                            <validation-messages [formCtrl]="operationPersonSelect"></validation-messages>
                        </span>
                        <span class="flex time" *ngIf="addexTitle == '退库作业' || addexTitle == '退库查看' ">
                            <label style="margin-top: 5px;width: 91px;margin-left: 25px;">退库日期：</label>
                            <input disabled style="  width:150px;height: 35px;margin-right: 10px;" name="operationTime"
                                type="text" [value]="operationTime |date:'yyyy-MM-dd'" />
                        </span>
                    </div>

                    <div class="p-formgroup-inline flex mt">
                        <div class="flex" *ngIf="checktype !=3">
                            <label class="lwid" style="margin-top: 5px;">出库原因：</label>
                            <input [disabled]="checktype ==1||checktype ==4" style=" width:820px;height: 60px;margin-right: 10px;"
                                name="reason" type="text" [(ngModel)]="inputForm.reason" />
                        </div>
                        <div class="flex" *ngIf="checktype ==3">
                            <label class="lwid" style="margin-top: 5px;">退库原因：</label>
                            <input [disabled]="checktype ==4" style=" width:820px;height: 60px;margin-right: 10px;" name="reason" type="text"
                                [(ngModel)]="inputForm.reason" />
                        </div>
                    </div>

                </div>
                <div *ngIf="checktype !=1 && checktype !=2 && checktype !=3&& checktype !=4" class="modal-footer"
                    style="justify-content: center;">
                    <button pButton type="button" (click)="close()" label="取消"
                        style="margin-left: 0.5rem"></button>
                    <button pButton [disabled]="!bopForm.form.valid" type="button" label="出库" (click)="addStoreOutEv()"
                        style="margin-left: 0.5rem"></button>
                </div>
                <div *ngIf="checktype ==2 && checktype !=3 " class="modal-footer" style="justify-content: center;">
                    <button pButton [disabled]="!bopForm.form.valid" type="button" (click)="close()" label="取消"
                        style="margin-left: 0.5rem"></button>
                    <button pButton [disabled]="!bopForm.form.valid" type="button" label="保存"
                        (click)="alterCertificateByBusinessEv()" style="margin-left: 0.5rem"></button>
                </div>
                <div *ngIf="checktype ==3 " class="modal-footer" style="justify-content: center;">
                    <button pButton type="button" (click)="close()" label="取消"
                        style="margin-left: 0.5rem"></button>
                    <button pButton [disabled]="!bopForm.form.valid" type="button" label="退库"
                        (click)="addCancellingHandleEv()" style="margin-left: 0.5rem"></button>
                </div>

            </form>
        </div>
    </div>
</div>